<template>
  <div>
    <mt-spinner v-show="loading" style="margin: 0 auto;" color="#e72e0d" type="double-bounce"></mt-spinner>
    <div class="index-account">
      <div class="item cur-flex cur-align-center">
        <i class="icon iconfont icon-yonghux"></i>
        <mt-field class="item-phone" label="" placeholder="请输入手机号" type="tel" v-model="form.userAccount"></mt-field>
      </div>
      <div class="item cur-flex cur-align-center">
        <i class="icon iconfont icon-mimax"></i>
        <mt-field label="" placeholder="请输入登录密码" type="password" v-model="form.password"></mt-field>
      </div>
      <mt-button :disabled="loading" style="letter-spacing: 4px;" @click.native="login()" class="submit-btn" type="danger">登录</mt-button>
    </div>
  </div>
</template>
<script>
import CryptoJS from 'crypto-js'
import * as api from '@/service/api'
import cookie from '@/utils/cookie'
export default {
  data () {
    return {
      loading: false,
      form: {
        userAccount: '',
        password: ''
      },
      rules: {
        userAccount: { required: true, message: '请输入账号名' },
        password: { required: true, message: '请输入密码' }
      }
    }
  },
  created () {
    if (localStorage.getItem('userAccount')) {
      this.form.userAccount = localStorage.getItem('userAccount')
    }
  },
  computed: {
    // 来源网址
    url () {
      return this.$route.query.url || ''
    },
    curRoute () {
      return this.$route.path
    }
  },
  methods: {
    async login () {
      try {
        try {
          await this.validate(this.form, this.rules)
        } catch (e) {
          return
        }
        if (this.form.userAccount && this.form.password) {
          let key = CryptoJS.enc.Base64.parse('MDEyMzQ1Njc4OUFCQ0RFRg==')
          let iv = CryptoJS.enc.Base64.parse('MDEyMzQ1Njc4OUFCQ0RFRg==')
          let encrypted = CryptoJS.AES.encrypt(this.form.password, key, {
            iv: iv,
            padding: CryptoJS.pad.Pkcs7,
            mode: CryptoJS.mode.CBC
          })
          let oldPassword = CryptoJS.enc.Utf8.parse(encrypted.ciphertext.toString())
          let base64Password = CryptoJS.enc.Base64.stringify(oldPassword)
          this.loading = true
          let res = await api.login({
            userAccount: this.form.userAccount,
            password: base64Password
            // password: this.password
          })
          this.loading = false
          if (this.remember) {
            localStorage.setItem('userAccount', this.form.userAccount)
          } else {
            localStorage.removeItem('userAccount')
          }
          this.loginNext(res.data.accessToken.value)
        }
      } catch (err) {
        console.log(err)
        this.loading = false
      }
    },
    loginNext (token) {
      cookie.set('device_id', token)
      sessionStorage.setItem('token', token)
      // this.$store.dispatch('getUserInfo')
      // this.$router.push('/dashboard/index')
      if (this.url) {
        window.location.href = this.url
      } else {
        this.$store.dispatch('getUserInfo')
        this.$router.push('/dashboard/index')
      }
    }
  }
}
</script>
<style lang="scss">
.index-account {
  .item i {
    font-size: 38px;
    color: $gray-darker;
  }
  .mint-cell {
    width: 100%;
    font-size: 26px;
  }
  .mint-cell-wrapper {
    background-image: none;
  }
  .item-phone {
    border-bottom: 0;
  }
  .submit-btn {
    width: 100%;
    font-size: 28px;
    margin-top: 48px;
  }
}
</style>
